@charset "utf-8";

@import "init.scss";
@import "common.scss";

main{
    background: #000000;
}
 //---------------个人主页导航头
    .my_page_header{
       border-bottom: 2px solid #464545;
       padding: 0 46px;
       ul,div{
            display: inline-block;
            vertical-align: middle;
        }
        span{
            color: #FFFFFF;
            font-size: 18px;
            line-height: 70px;
            vertical-align: middle;
        }
        ul{
            li{
                margin-left: 40px;
                a{
                    font-size: 18px;
                    color: #7d7c7c;
                    line-height: 70px;
                    &:hover{
                        color: #0dafd2;
                    }
                }
            }
        }
        .search{
            display: inline-block;
            width: 170px;
            height: 24px;
            margin-left: 98px;
            border: 1px solid #545454;
            form{
                width: 100%;
                height: 100%;
                input{
                    width: 128px;
                    height: 22px;
                    vertical-align: middle;
                    background: #000000;
                    padding-left: 6px;
                    border: none;
                    color: #FFFFFF;
                    outline: none;
                }
                .icon-ziyuan{
                    background: #000000;
                    color: #878686 ;
                    border: none;
                    vertical-align: middle;
                    font-weight: bold;
                    outline: none;
                    &:hover{
                        cursor: pointer;
                    }
                }
            }
            
        }
        
    }
//    大盒
//.big_box{
//  width: 100%;
//  margin: 29px auto;
//}
//.top_box{
//  width: 1064px;
//  height: 1685px;
//  background: black;
//  margin: 0 auto;
//}
//.tuijian {
//      margin: 0 40px;
//      p:first-of-type {
//          font-size: 33px;
//          color: white;
//      }
//      .tuijianlan {
//          border-bottom: 1px solid #4d4d4d;
//          div {
//              display: inline-block;
//              margin: 0 5px 15px;
//          }
//          p {
//              font-size: 12px;
//              line-height: 36px;
//              
//          }
//      }
//}
////  星巴克top部分结束
//
////.head_box{
////  width: 1064px;
////  height: 334px;
////  background: skyblue;
////  margin: 0 auto;
////}
//
//.mid_box{
//  width: 156px;
//  height: 1150px;
//  background-color: black;
//  margin: 0px auto;
//  
//  .zuo_top{
//      width: 205px;
//      height: 1150px;
//  }
//  .xuanze_box{
//      width: 155px;
//      margin-left: 44px;   
//  }
//  ul{
//      display: block;
//      width: 156px;
//      margin: 30 auto ;
//      color: #747373; 
//      font-size: 14px;
//      line-height: 40px;
//      text-align: center;
//      li{
//          background: #252525 ;
//          border-bottom: 5px solid black;
//          padding: 0px 27px 0px 52px;  
//
//      }
//  }
//  li:hover{
//      color: #ffffff;
//  }
//  
////  <!--左侧----左上开始-------->
//  .zuo_mid{
//      width:156px;
//      height: 481px;
//      background:#252525 ;
//      text-align: center;
//      color: #139ab8;
//      span{
//      display: inline-block;
//      font-size: 14px;
//      margin:13px auto ;
//      }
//      p{
//      font-size: 14px;
//      color: #747373;
//      margin: 0 13px 0 65px;
//  }
//      p:hover{
//      color: #0fa8ca;
//  }
//  }
//  
//  .border_top{
//      width: 135px;
//      margin: 0 auto;
//      border-top: 1px solid #444444;
//  }
//  .border_bot{
//      border-bottom: 1px solid #444444;
//      width: 135px;
//      margin: 13px auto;
//  }
//  .img_mid_box{
//      margin: 10px 0px 0 13px;
//  }
//  .img_mid{
//      width: 156px;
//      padding-top: 8px;
//  .img_box{
//      width:53px ;
//  }
//      img{
//          width: 100%;
//      }
//      span{
//          font-size: 12px;
//          color: #747474;
//          margin: 0 28px 0 0px;  
//      }
//  }
////  <!--左侧----左下开始-------->
//  .zuo_bottom{
//      width: 156px;
//      margin:7px 0 0 44px;
//      text-align: center; 
//      .bottom{
//          width:156px;
//          height: 527px;
//          background:#252525 ;
//          color: #139ab8;
//          p{
//              font-size: 14px;
//              color: #747373;
//          }
//          span{
//              display: inline-block;
//              text-align: center;
//              font-size: 14px;
//              margin:10px auto ;
//          }
//        
//          
//          .bottom_box{
//              width:120px ;
//              margin: 0 0px 0 12px; 
//              p{
//                  text-align: left;
//                  margin: 0 9px;
//              } 
//          }
//          .bottom_img_box{
//              width: 156px;
//              padding-top: 10px;
//              div{
//                  display: inline-block;
//                  p{
//                  font-size: 14px;
//                  color: #7d7d7d;
//                  margin: 0px 0 0px px;
//                   }
//              }
//              
//          }
//          .bottom_img{
//              width: 53px;
////              height: 100px;
//              display: inline-block;
//              img{
//              width: 100%;
//              }  
//          } 
//          .foot_box{
//              display: inline-block;
//              margin: 0px 0 15px 0;
//          }
//          .foot_bot{
//              width: 135px;
//              margin: 0 auto;
//              margin-top: 10px;
//              border: 1px solid #444444;
//          }  
//          .foot p{
//             font-size: 14px;
//              color: #747373;
//              margin: 18px 13px 0 65px;
//          }
//          p:hover{
//                   color: #0fa8ca;
//          }
//      }
//      
//  }
//}
//左边信息栏结束--------------------
//右边中部发布信息---------------------
.you_mid{
     width: 812px;
     height: 1150px;
     background: white;
     margin: 0 44px 0 0; 
     .you_fa_box{
         
         .you_fabu{
             text-align: center;
             p{
                 font-size: 30px;
                 color: #0dafd2;
                 margin-top: 40px;
                
             }
         }
//           .line::before{
//               content: "";
//               width: 171px;
//               height: 47px;
//               text-align: center;
//               padding-top: 15px;
//               margin: 65px 0 0 60px;
//               color:#FFFFFF;
//               background: #0dafd2;
//               font-size: 15px;
//               display: block;
//           }
            .line_1{
                width: 171px;
                height: 47px;
                display: inline-block;
                position: relative;
                background: #0dafd2;
                text-align: center;
                line-height: 47px;
                margin: 65px 7px 0 60px;
                color:#FFFFFF;
//              overflow: hidden;
            }
             .line_1::after{
                 content: "";
                 display: block;
                 position: absolute;
                 right: -47px;
                 top: 0px;
                 border-top: 24px solid transparent;
                border-right: 24px solid transparent;
                border-bottom: 24px solid transparent;
                border-left: 24px solid #0dafd2;
             }
             .line_2{
                width: 171px;
                height: 47px;
                display: inline-block;
                margin: 0 0 0 11px;
                position: relative;
                background: #6f6f6f;
                text-align: center;
                line-height: 47px;  
                color:#FFFFFF;  
             }
             .line_2::after{
                content: "";
                display: block;
                position: absolute;
                left: 0;
                top: 0px;
                border-top: 24px solid transparent;
                border-right: 24px solid transparent;
                border-bottom: 24px solid transparent;
                border-left: 24px solid #FFFFFF;
             }
             form{
                 width: 812px;
                 display: block;
                 div{
                     width: 100%;
                     font-size: 15px;
                     margin: 40px 0px 40px 60px;
                     span{
                         width: 93px;
                         display: inline-block;
                     }
                      input{
                         width: 256px;
                         height: 28px;
//                       margin-left: 30px;
                     }
                     img{
                         display: inline-block;
                         margin: 18px 0 0 99px;
                         &:hover{
                             transform: translateY(5px);
                             cursor: pointer;
                         }
                     }
                     p{
                         font-size: 15px;
                         color: #0dafd2;
                         display: inline-block;
                         margin-left: 10px;
                          
                         &:hover{
                             transform: translateY(5px);
                             cursor: pointer;
                         }
                     }
                    }
                    
                   
                     textarea{
                         width: 652px;
                         height: 205px;
                         vertical-align: top;
//                       margin-left: 30px;
                     }   
                     .phone{
                         width: 100px;
                         border: none;
                        &+span{
                            color:#0dafd2 ;
                        } 
                        &+span:hover{
                            color: #6f6f6f;
                            cursor: pointer;
                        }
                     } 
                     hr{
                         
                         border: 1px solid #f0f0f0;
                     } 
                     .tijiao{
                         width: 145px;
                         height: 41px;
                         font-size: 18px;
                         color: #FFFFFF;
                         background: #0dafd2;
                         cursor: pointer;
                         &:hover{
                             transform: translateY(-5px);
                         }
                     }
             }
         
     }
    
}
